<template>
	<view class="xx">
		<van-field :value="fieldValue" is-link readonly label="地区" placeholder="请选择所在地区" @tap="onClick()" />
		<van-popup :show="show" round position="bottom">
			<van-cascader :show="show" :value="cascaderValue" title="请选择所在地区" :options="options" @close="onClose"
				@finish="onFinish" />
		</van-popup>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				show: false,
				fieldValue: '',
				cascaderValue: '',
				options: []
			};
		},
		onShow() {
			this.getType()
		},
		methods: {
			getType() {
				this.$request('/post/type', {
					// 传参参数名：参数值,如果没有，就不需要传
				}, 'GET').then(res => {

					this.options = res.map(
						item => {
							return {
								value: item.id.toString(),
								text: item.piazzaName
							}
						})
					console.log(this.options)

				}).catch(err => {
					console.log(err)
				})
			},
			onClick() {
				this.show = true;
			},

			onClose() {
				this.show = false;
			},
			onFinish(e) {
				const {
					selectedOptions,
					value
				} = e.detail;
				console.log(e.detail);
				const fieldValue = selectedOptions
					.map((option) => option.text || option.name)
					.join('/');
				console.log(fieldValue);
				this.cascaderValue = value;
				this.fieldValue = fieldValue
				this.show = false;
			},
		}

	};
</script>

<style>

</style>
